import { Component, OnInit } from '@angular/core'
import { observable } from 'mobx-angular'
import { createViewModel } from 'mobx-utils'

@Component({
  selector: 'app-view-model',
  templateUrl: './view-model.component.html',
  styleUrls: [ './view-model.component.css' ]
})
export class ViewModelComponent implements OnInit {
  mA
  vmA

  constructor() {
    this.mA = new Model()
    this.vmA = createViewModel(this.mA)
  }

  ngOnInit() {
    /*const s = new Model2()
    console.log(new Model2())
    Object.getOwnPropertyNames(s).forEach(key => {
      console.log(key)
    })*/

    /* const p = {}
     Object.defineProperty(p, 'name', {
       get: function () {
         return 'nnnn'
       },
       configurable: true
     })

     Object.getOwnPropertyNames(p).forEach(key => {
       console.log('----', key)
     })*/

    // const a = new Model3()
    // Object.getOwnPropertyNames(a).forEach(key => console.log(key))
    const Model3 = function () {
    }
    Object.defineProperty(Model3.prototype, 'aaa', {
      get: function () {
        return 'A'
      },
      set: function (_) {
      },
      enumerable: true,
      configurable: true
    })

    console.log(Model3)
    console.log(Model3.prototype)

    const a = new Model3()
    // Reflect.ownKeys(a).forEach(key => console.log(key))
    // Object.getOwnPropertyNames(a).forEach(key => console.log(key))

    const b = Object.getPrototypeOf(a)
    console.log(b)
  }

  onReset() {
    this.vmA.reset()
  }

  onSubmit() {
    this.vmA.submit()
  }
}

class Model {
  @observable a

  @observable b
}
